<template>
	<view class="page">
		<view class="my-top">
			<!-- head -->
			<view class="head" :style="'background-color: rgba(255,255,255,'+(scrollTop/50)+');'">
				<view class="title">
					<text v-show="scrollTop>20"></text>
				</view>
				<view class="setting-mess">
					<view class="setting" @click="onSetting">
						<text class="iconfont icon-setting" :style="scrollTop>20?'color:#333333':''"></text>
					</view>
					<view class="mess" @click="onMessage">
						<text class="iconfont icon-xiaoxi" :style="scrollTop>20?'color:#333333':''"></text>
						<text class="num" v-if="memberInfo.msg_num">{{memberInfo.msg_num}}</text>
					</view>
				</view>
			</view>
			<!-- 用户信息 -->
			<view class="user-info" v-if="myMobile">
				<view class="portrait" @click="onWallet('AccountInfo')">
					<image src="/static/touxiang.png"></image>
				</view>
				<view class="info">
					<view class="nickname">
						<text>{{myMobile.substr(0,3)+"****"+myMobile.substr(7,11)}}</text>
					</view>
					<view class="rank">
						<image src="/static/rank.png"></image>
						<text>{{memberInfo.agent_id == 1 ? '代理商' : '普通用户'}}</text>
					</view>
				</view>
				<!--view class="realname" :class="{'icon':realname}">
					<text>{{realname?'已实名':'未认证'}}</text>
				</view-->
			</view>
			<view class="user-info" v-else @click="gologin">
				<view class="portrait">
					<image src="/static/touxiang.png"></image>
				</view>
				<view class="info">
					<view class="nickname">
						<text>登录/注册</text>
					</view>
				</view>
			</view>
			<!-- 关注区 -->
			<view class="focus-area">
				<view class="list">
					<view class="num">
						<text>{{calculate(memberMoney.total)}}</text>
					</view>
					<view class="title">
						<text>账户资金</text>
					</view>
				</view>
				<view class="list">
					<view class="num">
						<text>{{calculate(memberMoney.bond_account)}}</text>
					</view>
					<view class="title">
						<text>保证金</text>
					</view>
				</view>
				<view class="list">
					<view class="num">
						<text>{{calculate(memberMoney.freeze)}}</text>
					</view>
					<view class="title">
						<text>冻结资金</text>
					</view>
				</view>
			</view>
			<!-- 会员 -->
			<view class="vip-info" @click="onHelp">
				<view class="vip">
					<text>帮助中心</text>
					<text class="line"></text>
				</view>
				<view class="vip-explain">
					<text>如何申请配资和充值入金</text>
				</view>
				<view class="vip-btn">
					<text>立即查看</text>
				</view>
			</view>
		</view>
		<!-- 钱包 -->
		<view class="wallet-info">
			<view class="sub">
				<!--view class="list">
					<view class="icon">
						<text class="number">{{memberMoney.operate_account}}</text>
					</view>
					<view class="title">
						<text>操盘资金</text>
					</view>
				</view-->
				<view class="list">
					<view class="icon">
						<text class="number">{{memberMoney.account}}</text>
					</view>
					<view class="title">
						<text>账户余额</text>
					</view>
				</view>
			</view>
			<view class="sub">
				<view class="list" @click="onWallet('wallet')">
					<view class="icon">
						<text class="cuIcon-pay icon_24 red"></text>
					</view>
					<view class="title">
						<text class="action">充值</text>
					</view>
				</view>
				<view class="list" @click="onWallet('Withdraw')">
					<view class="icon">
						<text class="cuIcon-moneybag icon_24 red"></text>
					</view>
					<view class="title">
						<text class="action">提现</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 积分，付款码 -->
		<view class="integral-payment">
			<view class="list" @click="onWallet('AccountInfo')">
				<view class="title">
					<text class="cuIcon-edit icon_18"></text>
					<text>账户资料</text>
				</view>
				<view class="mess">
					<text>实名认证 修改密码</text>
				</view>
			</view>
			<view class="list" @click="onWallet('MyShare')">
				<view class="title">
					<text class="cuIcon-qr_code icon_18"></text>
					<text>推广赚钱</text>
				</view>
				<view class="mess">
					<text>邀请好友 赚取佣金</text>
				</view>
			</view>
		</view>
		<view class="integral-payment">
			<view class="list" @click="onWallet('peiziList')">
				<view class="title">
					<text class="cuIcon-apps icon_18"></text>
					<text>配资管理</text>
				</view>
				<view class="mess">
					<text>我的操盘 审核状态</text>
				</view>
			</view>
			<view class="list" @click="onWallet('moneylog')">
				<view class="title">
					<text class="cuIcon-list icon_18"></text>
					<text>资金明细</text>
				</view>
				<view class="mess">
					<text>查看流水 充提账目</text>
				</view>
			</view>
		</view>
		<!-- 我的服务 -->
		<view class="my-service">
			<view class="title">
				<text>我的服务</text>
			</view>
			<view class="service-list">
				<view class="list" v-if="memberInfo.agent_id == 1" @click="onServer('agentInofo')">
					<view class="thumb">
						<text class="cuIcon-group icon_24"></text>
					</view>
					<view class="name">
						<text>代理中心</text>
					</view>
				</view>
				<view class="list" @click="onServer('onlinekefu')">
					<view class="thumb">
						<text class="cuIcon-community icon_24"></text>
					</view>
					<view class="name">
						<text>在线客服</text>
					</view>
				</view>
				<view class="list" @click="onServer('feedback')">
					<view class="thumb">
						<text class="cuIcon-post icon_24"></text>
					</view>
					<view class="name">
						<text>意见反馈</text>
					</view>
				</view>
				<view class="list" @click="onServer('serve')">
					<view class="thumb">
						<text class="cuIcon-phone icon_24"></text>
					</view>
					<view class="name">
						<text>服务热线</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 客服热线 -->
		<view class="serve-hotline" @click="isHotline = false">
			<view class="cu-modal bottom-modal" :class="{'show':isHotline}">
			  <view class="cu-dialog">
					<view class="contact-list">
						<view class="list">
							<text>呼叫客服</text>
						</view>
						<view class="list">
							<text class="text-gray" @click="makeCall(confData.kfphone)">{{confData.kfphone}}</text>
						</view>
						<view class="list">
							<text>取消</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- tabbar -->
		<TabBar :tabBarShow="4"></TabBar>
	</view>
</template>

<script>
	var _self,loginRes;
	import TabBar from '../../components/TabBar/TabBar.vue';
	export default {
		components:{
			TabBar,
		},
		data() {
			return {
				token    : '',
				scrollTop: 0,
				isHotline: false,
				myMobile : '',
				memberInfo : {},
				memberMoney: {},
				goodsList  : [],
				confData   : uni.getStorageSync('confData'),
			};
		},
		onShow() {
			this.getMember(this.token);
		},
		onLoad(){
			_self = this;
			loginRes = _self.checkLogin();
			if(!loginRes){return;}
			//console.log(loginRes);
			this.myMobile = loginRes[1];
			this.token    = loginRes[2];
		},
		onReady() {
			uni.hideTabBar();
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		methods:{
			async getMember(token){
				uni.request({
					url: this.apiServer+'/apicom/member',
					header: {'content-type' : "application/x-www-form-urlencoded"},
					method: 'POST',
					timeout: 5000,
					data:{
						token: token
					},
					success: res => {
						if(res.data.status == 1){
							//console.log(res.data.data);
							this.memberInfo  = res.data.data.info;
							this.memberMoney = res.data.data.money;
						}
					},
					complete:function(){
					    uni.stopPullDownRefresh();
					},
					fail:function(e){
						uni.showToast({title:"加载失败!",icon:"none"});
					}
				});
			},
			/*计算单位*/
			calculate(number){
				number = parseInt(number);
				if(number==0 || !number)return 0;
				if(number.toString().length >= 13){
					var unit = (number/1000000000000).toFixed(2);
					return unit + '万亿';
				}else if(number.toString().length >= 9){
					var unit = (number/100000000).toFixed(2);
					return unit + '亿';
				}else if(number.toString().length > 4){
					var unit =  (number/10000).toFixed(2);
					return unit + '万';
				}else{
					var unit =  number.toFixed(2);
					return unit;
				}
			},
			/*配资、资金明细跳转，钱包跳转点击*/
			onWallet(type){
				switch (type){
					case 'peiziList':
						uni.navigateTo({
							url: '/pages/AfterSalesOrder/AfterSalesOrder',
						})
						break;
					case 'moneylog':
						uni.navigateTo({
							url: '/pages/MoneyLog/MoneyLog',
						})
						break;
					case 'wallet':
						uni.navigateTo({
							url: '/pages/MyWallet/MyWallet',
						})
						break;
					case 'Withdraw':
						uni.navigateTo({
							url: '/pages/Withdraw/Withdraw',
						})
						break;
					case 'MyShare':
						uni.navigateTo({
							url: '/pages/MyShare/MyShare',
						})
						break;
					case 'AccountInfo':
						uni.navigateTo({
							url: '/pages/AccountInfo/AccountInfo',
						})
						break;
				}
			},
			/*我的服务点击*/
			onServer(type){
				switch (type){
					case 'feedback':
						uni.navigateTo({
							url: '/pages/Feedback/Feedback'
						})
						break;
					case 'onlinekefu':
						uni.navigateTo({
							url: '/pages/WebOnline/WebOnline'
						})
						break;
					case 'serve':
						this.isHotline = true;
						break;
					case 'agentInofo':
						uni.navigateTo({
							url: '/pages/Agents/Agents',
						})
						break;
				}
			},
			/*设置点击*/
			onSetting(){
				uni.navigateTo({
					url: '/pages/Setting/Setting'
				})
			},
			/*消息点击*/
			onMessage(){
				uni.navigateTo({
					url: '/pages/Message/Message'
				})
			},
			/**
			 * 会员点击
			 */
			onHelp(){
				uni.navigateTo({
					url: '/pages/Help/Help?id=9&page=1',
				})
			},
			gologin(){
				uni.navigateTo({
					url: '/pages/login/login',
				})
			},
			makeCall(number){
				// #ifdef APP-PLUS
				uni.makePhoneCall({
				    phoneNumber: number //电话号码
				});
				// #endif
			}
		}
	}
</script>

<style scoped lang="scss">
	@import 'my.scss';
</style>
